<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="container">
        <!-- 货架 -->
        <div class="shelves">
            <img src="./img/911.png" id="cover">
            <h1 id="name">保时捷911</h1>
        </div>
        <div class="content">
            <!-- 砍价进度 -->
            <div class="count-down">
                <p class="kj-tip">已砍 <span id="already">0</span> 元，仅差 <span id="remain">0</span> 元免费拿</p>
                <div class="progress"><span class="value"></span></div>
                <button class="invite-btn">邀请好友砍一刀</button>
            </div>
            <!-- 砍价记录 -->
            <div class="kj-log">
                <h1>砍价记录</h1>
                <ul class="log-list">
                    <li>
                        <div class="order-number">1</div>
                        <div>
                            <img src="./img/a1.jpeg" alt="头像" class="avatar">
                        </div>
                        <div>
                            <h3>张三</h3>
                            <p>使用砍价工具狂砍一刀</p>
                        </div>
                        <div>
                            砍掉50元
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="mask hide">
        <img src="./img/close.png" class="close-btn">
        <div class="card">
            <img src="./img/911.png" class="cover">
            <h1 class="name">保时捷911</h1>
            <p>恭喜老板喜提911一辆</p>
            <p>赶快向朋友炫耀一下吧！</p>
        </div>
        <canvas id="canvas" width="10rem" height="100%"></canvas>
    </div>
</body>
<script src="./lib/setrem.js"></script>
<script src="./lib/jquery.js"></script>
<script src="./lib/confetti.js"></script>
<script src="./js/index.js"></script>

</html>